import {
  Space, Form, Input, Button,
} from 'antd'
import { useCallback, useState } from 'react'
import { useRequest } from 'ahooks'
import { getAdminDetailApi } from '../../../../../api/auth'

const SetRootIdSearch = (props) => {
  const { setAdminList, getAdminList } = props
  const [adminname, setAdminname] = useState('')
  const { data } = useRequest(() => getAdminDetailApi(adminname), { ready: adminname })
  const handleAdminnameChange = useCallback((e) => {
    setAdminname(e.target.value)
  })
  const onSearch = useCallback(() => {
    if (!adminname) {
      getAdminList()
      return
    }
    setAdminList(data)
  })
  return (
    <Space direction="vertical" style={{ display: 'flex', padding: '20px 20px 40px' }}>
      <Form>
        <Form.Item label="名字" name="adminname1" style={{ width: '250px' }}>
          <Input value={adminname} onChange={handleAdminnameChange} />
        </Form.Item>
        <Form.Item style={{ marginLeft: '40px' }}>
          <Button type="primary" onClick={onSearch}>查询</Button>
        </Form.Item>
      </Form>
    </Space>
  )
}

export default SetRootIdSearch
